<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0 user-scalable=no">
    <title>芳小微宣</title>
    <!-- 引入 WeUI -->
    <link rel="stylesheet" href="http://res.wx.qq.com/open/libs/weui/0.4.0/weui.min.css">
    <script src="js/jquery.min.js"> </script>
    <script src="js/index.js"></script>
    <link rel="stylesheet" href="css/index.css">
    <style>
        a {
            width: 100%;
            height: 100% ;
            display: inline-block;
            color: #000;
        }
        .weui_cells_title{
            font-size: 17px;
            text-align: center;
            background: #80cf02;
            margin: 0px;
            height: 50px;
            line-height: 50px;
            color: #fff;
        }
    </style>
</head>
<body>
<div style="position: fixed; width: 100%;top: 0px; background: #fff;">
    <div class="weui_cells_title">荣誉墙</div>
    <div style="text-align: center;margin-top: 1rem">
        <input type="text" placeholder="输入学号搜索" id="searchVal"/>
        <img src="images/search.png" style="position: absolute;right: 30px;width: 25px;top: 65px;" id="search"/>
    </div>
    <div class="selDiv" style="text-align: center">
        <span style="font-size: 4.8rem;">选择班级：</span>
        <select class="selSty classMc">
            <option>请选择</option>
        </select>
    </div>
    <div class="tabTitle">
        <div class="tabTitle-left">
            姓名
        </div>
        <div class="tabTitle-right">
            学号
        </div>
    </div>
</div>

<div id="dataList" style="margin-top: 212px; margin-bottom: 50px;"></div>
<div class="returnBtn">
    <a href="index.html">
        <img src="images/return.png" style="width: 25px;padding-top: 4px;"><br>
        <span>返回</span>
    </a>
</div>
<div class="weui_dialog_alert" style="display: none;">
    <div class="weui_mask"></div>
    <div class="weui_dialog">
        <div class="weui_dialog_hd"> <strong class="weui_dialog_title">警告</strong>
        </div>
        <div class="weui_dialog_bd">弹窗内容，告知当前页面信息等</div>
        <div class="weui_dialog_ft">
            <a href="javascript:;" class="weui_btn_dialog primary">确定</a>
        </div>
    </div>
</div>
<script>
    $(function(){
        $.ajax({
            type : "POST",
            url : path + "/api/weixin/getClassBySchool?token=" + window.localStorage.getItem("token"),
            data : {},
            dataType : 'json',
            async : true,
            success : function(msg) {
                if(msg.code == 0){
                    var imghtml = "";
                    for(var i=0;i<msg.classList.length;i++){
                        imghtml += '<option value="'+ msg.classList[i].classId +'">'+ msg.classList[i].className +'</option>';
                    }
                    $(".classMc").append(imghtml);
                    $(".classMc").find("option").eq(1).attr("selected",'selected');
                    $(".classMc").change();
                }else if(msg.code == 501){
                    window.location.href = "login.html";
                }
            }
        });

        $(".classMc").change(function(tag){
           if($(".classMc").val() == "请选择"){
               return;
           }
            $.ajax({
                type : "POST",
                url : path + "/api/weixin/getStudentByClass?token=" + window.localStorage.getItem("token"),
                data : {
                    classId:$(".classMc").val()
                },
                dataType : 'json',
                success : function(msg) {
                    if(msg.code == 0){
                        // 先清空
                        $("#dataList").empty();
                        if(msg.studentList.length>0){
                            var imghtml = "";
                            for(var i=0;i<msg.studentList.length;i++){
                                imghtml += '<div class="tabData"><a href="honor.html?studentid='+ msg.studentList[i].studentId +'"><div class="tabData-left">'+ msg.studentList[i].name +'</div><div class="tabData-right">'+ msg.studentList[i].studentId +'</div></a></div>';
                            }
                            $("#dataList").append(imghtml);
                        }else{
                            $("#dataList").append('<div class="nodata"><img src="images/nodata.png"/><br>暂无数据</div>');
                        }
                    }else if(msg.code == 501){
                        window.location.href = "login.html";
                    }
                }
            });
        });

    });
    $.weui = {};
    $.weui.alert = function(options){
        options = $.extend({title: '提示', text: '提示内容'}, options);
        var $alert = $('.weui_dialog_alert');
        $alert.find('.weui_dialog_title').text(options.title);
        $alert.find('.weui_dialog_bd').text(options.text);
        $alert.on('touchend click', '.weui_btn_dialog', function(){
            $alert.hide();
            //阻止事件冒泡
             return false;
        });
        $alert.show();
    };

    $("#search").click(function(){
        if($("#searchVal").val().replace(/[ ]/g, "") == ""){
            $.weui.alert({text: "请输入学号！"});
            return;
        }
        $(".classMc").find("option").eq(0).attr("selected",'selected');
        $.ajax({
            type : "POST",
            url :  path + "/api/weixin/getStudentById?token=" + window.localStorage.getItem("token"),
            data : {
                studentId : $("#searchVal").val()
            },
            dataType : 'json',
            success : function(msg) {
                if(msg.code == 0){
                    // 先清空数据
                    $("#dataList").empty();
                    if(msg.studentList.length>0){
                        var imghtml = "";
                        for(var i=0;i<msg.studentList.length;i++){
                            imghtml += '<div class="tabData"><a href="honor.html?studentid='+ msg.studentList[i].studentId +'"><div class="tabData-left">'+ msg.studentList[i].name +'</div><div class="tabData-right">'+ msg.studentList[i].studentId +'</div></a></div>';
                        }
                        $("#dataList").append(imghtml);
                    }else{
                        $("#dataList").append('<div class="nodata"><img src="images/nodata.png"/><br>暂无数据</div>');
                    }
                }else if(msg.code == 501){
                    window.location.href = "login.html";
                }
            }
        })
    });

</script>
</body>
</html>